:root {
    --main-padding: 3rem;
    /* COLORS */
    /* Primitives: colors */
    --color-black: #000000;
    --color-white: #ffffff;
    --color-gray-100: #F3F3F3;
    --color-gray-400: #D9D9D9;
    --color-gray-600: #A1A1AA;
    --color-gray-800: #444444;
    --color-green-300: #85DA6A;
    --color-green-600: #009B3E;
    --color-green-700: #00742e;
    --color-green-900: #0A2B1A;
    --color-green-950: #051D11;
    /* Text colors */
    --color-text-base: var(--color-green-900);
    --color-text-muted: var(--color-gray-800);
    --color-text-disabled: var(--color-gray-600);
    --color-text-inverse: var(--color-white);
    /* Link colors */
    --color-link-default: var(--color-green-600);
    --color-link-hover: var(--color-green-700);
    --color-link-active: var(--color-green-700);
    --color-link-visited: var(--color-green-700);
    --color-link-disabled: var(--color-gray-600);
    --color-link-focus: var(--color-green-700);
    /* Background colors */
    --color-background-default: var(--color-white);
    --color-background-subtle: var(--color-gray-100);
    --color-background-dark: var(--color-green-950);
    /* SPACINGS */
    /* Primitives: spacings */
    --spacing-8: 0.5rem;
    --spacing-16: 1rem;
    --spacing-24: 1.5rem;
    --spacing-32: 2rem;
    --spacing-48: 3rem;
    --spacing-56: 3.5rem;
    --spacing-64: 4rem;
    --spacing-80: 5rem;
    --spacing-96: 6rem;
    /* Display stacks */
    --display-stacks-sm: var(--spacing-8);
    --display-stacks-md: var(--spacing-16);
    --display-stacks-lg: var(--spacing-24);
    --display-stacks-xl: var(--spacing-32);
    --display-stacks-2xl: var(--spacing-48);
    --display-stacks-3xl: var(--spacing-56);
    --display-stacks-4xl: var(--spacing-96);
    /* Display insets */
    --display-insets-sm: var(--spacing-8);
    --display-insets-md: var(--spacing-16);
    --display-insets-lg: var(--spacing-24);
    --display-insets-xl: var(--spacing-32);
    --display-insets-2xl: var(--spacing-48);
    --display-insets-3xl: var(--spacing-56);
    --display-insets-4xl: var(--spacing-96);
    /* FONTS */
    /* Primitives: font size */
    --size-14px: 0.875rem;
    --size-16px: 1rem;
    --size-18px: 1.125rem;
    --size-20px: 1.25rem;
    --size-24px: 1.5rem;
    --size-28px: 1.75rem;
    --size-32px: 2rem;
    --size-40px: 2.5rem;
    --size-48px: 3rem;
    --size-64px: 4rem;
    --size-72px: 4.5rem;
    --size-96px: 6rem;
    --size-128px: 8rem;
    --size-128px: 8rem;
    /* Font size */
    --font-size-xs: var(--size-14px);
    --font-size-sm: var(--size-16px);
    --font-size-md: var(--size-18px);
    --font-size-lg: var(--size-20px);
    --font-size-xl: var(--size-32px);
    --font-size-2xl: var(--size-48px);
    --font-size-3xl: var(--size-64px);
    --font-size-4xl: var(--size-96px);
    /* Font weight */
    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;
    --font-weight-bolder: 900;
    /* Text size*/
    --text-body-small: var(--size-16px);
    --text-body-base: var(--size-18px);
    --text-body-large: var(--size-24px);
    /* Headings size*/
    --text-heading-1: var(--size-48px);
    --text-heading-2: var(--size-32px);
    --text-heading-3: var(--size-28px);
    --text-heading-4: var(--size-24px);
    --text-heading-5: var(--size-20px);
    --text-heading-6: var(--size-18px);
    --text-heading-huge: var(--size-64px);
    --margin-heading-1: calc(var(--text-heading-1) * 0.5);
    --margin-heading-2: calc(var(--text-heading-2) * 0.5);
    --margin-heading-3: calc(var(--text-heading-3) * 0.5);
    --margin-heading-4: calc(var(--text-heading-4) * 0.5);
    --margin-heading-5: calc(var(--text-heading-5) * 0.5);
    --margin-heading-6: calc(var(--text-heading-6) * 0.5);
    --margin-heading-huge: calc(var(--text-heading-huge) * 0.5);
    /* ICONS AND IMAGES */
    --icon-menu-toggler-url: url("../images/vici-menu-toggle.svg");
    --breadcrumb-divider-url: url("../images/arrow-right.svg");
    --quote-left-url: url("../images/quote-left.svg");
    --quote-right-url: url("../images/quote-right.svg");
    /* Components */
    --spacer-padding: 2rem;
}

@media screen and (min-width: 992px) {
    :root {
        /* Texts */
        --text-body-small: var(--size-16px);
        --text-body-base: var(--size-20px);
        --text-body-large: var(--size-24px);
        --text-body-headline: var(--size-32px);
        /* Headings */
        --text-heading-1: var(--size-72px);
        --text-heading-2: var(--size-48px);
        --text-heading-3: var(--size-32px);
        --text-heading-4: var(--size-28px);
        --text-heading-5: var(--size-24px);
        --text-heading-6: var(--size-20px);
        --text-heading-huge: var(--size-128px);
        --margin-heading-1: calc(var(--text-heading-1) * 1.2);
        --margin-heading-2: calc(var(--text-heading-2) * 1.2);
        --margin-heading-3: calc(var(--text-heading-3) * 1.2);
        --margin-heading-4: calc(var(--text-heading-4) * 1.2);
        --margin-heading-5: calc(var(--text-heading-5) * 1.2);
        --margin-heading-6: calc(var(--text-heading-6) * 1.2);
        --margin-heading-huge: calc(var(--text-heading-huge) * 1.2);
        /* Font size */
        --font-size-xs: var(--size-16px);
        --font-size-sm: var(--size-18px);
        --font-size-md: var(--size-20px);
        --font-size-lg: var(--size-24px);
        --font-size-xl: var(--size-48px);
        --font-size-2xl: var(--size-64px);
        --font-size-3xl: var(--size-96px);
        --font-size-4xl: var(--size-160px);
        /* Components */
        --spacer-padding: 3.5rem;
    }
}